---
title: For developers
description: How to use our components from their npm package
---

**`Orbit-components` is a React component library to help developers build travel products.**

---

## Orbit Mission

Orbit aims to bring order and consistency to all of our products and processes.
We elevate the user experience and increase the speed and efficiency of how we design and build products.

## Installation

`orbit-components` is served as an [npm package](https://www.npmjs.com/package/@kiwicom/orbit-components).

Add them to your project by running:

```shell
// with npm
npm install @kiwicom/orbit-components

// with yarn
yarn add @kiwicom/orbit-components
```

## Usage

1. Import the fonts that are used in `orbit-components`:

   ```html
   <link
     href="https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700"
     rel="stylesheet"
   />
   ```

   Or via CSS:

   ```css
   @import url("https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700");
   ```

2. Include any of our components in your project and use it:

   ```jsx
   import Alert from "@kiwicom/orbit-components/lib/Alert";

   <Alert>Hello World!</Alert>;
   ```

If you want to use a custom theme inside your project,
it's necessary to wrap your app in `<OrbitProvider>`.
See [more info about the Orbit provider](/utilities/orbit-provider/).

For a live preview, check out our [Storybook](https://kiwicom.github.io/orbit/) or [orbit.kiwi](https://orbit.kiwi).

You can also try `orbit-components` directly on our [Playroom](https://kiwicom.github.io/orbit/playroom/).

## Typescript

Orbit comes with Typescript definition files.

## Main Sections

- [Components](/components/)
- [Icons](/foundation/icons/)
- [Right to left languages](/development/utilities/rtl-languages/)
- [OrbitProvider](/utilities/orbit-provider/)
- [Theming](https://github.com/kiwicom/orbit/blob/master/.github/theming.md)

## Contributing

We're working on making this project a fully open source.
We appreciate any contributions you might make.

[Bug reports](https://github.com/kiwicom/orbit/issues/new?template=bug_report.md)
and [feature requests](https://github.com/kiwicom/orbit/issues/new?template=feature_request.md) are welcome,
but please use the correct template.

Please check out our [contribution guide](https://github.com/kiwicom/orbit/tree/master/.github/CONTRIBUTING.md).
It includes contribution guidelines and information on how to run and develop the project.

### Feedback

We want to provide only components of the highest quality.
We can't do that without your feedback.
If you have any suggestions about what we can do to improve components,
please report it directly as an [issue](https://github.com/kiwicom/orbit/issues/new/choose).
Kiwi.com users can also slack us at **\#plz-orbit**.

## More to explore

- [Design tokens](/foundation/design-tokens/)
- [Icons](/foundation/icons/)
- [Components contribution guide](https://github.com/kiwicom/orbit-components/blob/master/.github/CONTRIBUTING.md)
